<template>
	<!-- 按钮弹框 -->
	<u-popup :show="show" bgColor="rgba(0,0,0,0)" @close="closeMore" custom-style="padding:0 16rpx 0;">
		<view style="margin-bottom: -16rpx;">
			<view style="margin-bottom: 16rpx;border-radius: 16rpx;overflow: hidden;">
				<u-button v-for="(item,index) in btnList" @click="item.clickEvent" shape="circle"
					:custom-style="{...moreBtnStyle,marginBottom:0,borderRadius:0}">
					{{item.name}}
				</u-button>
			</view>
			<u-button shape="circle" :custom-style="{ ...moreBtnStyle, fontWeight: 600 }" @click="closeMore">
				取消
			</u-button>
		</view>
	</u-popup>
</template>

<script setup>
	const props = defineProps({
		show: {
			type: String,
			required: true,
			default: false
		},
		btnList: {
			type: Array,
			default: [{
					name: '删除馆',
					clickEvent: {}
				},
				{
					name: '退出馆',
					clickEvent: {}
				}
			]
		}
	})
	console.log(props.btnList)
	const emits = defineEmits('update:show')

	const moreBtnStyle = {
		height: '120rpx',
		borderRadius: '26rpx 26rpx 26rpx 26rpx',
		backgroundColor: '#fff',
		fontWeight: '400',
		fontSize: '40rpx',
		color: '#007AFF',
		marginBottom: '16rpx'
	};

	const closeMore = () => {
		emits('update:show', false)
	}
</script>

<style lang="scss" scoped>
</style>